import { Link, useNavigate } from 'react-router-dom'

const Login = () => {
	const navigate = useNavigate()

	return (
		<>
			<h1>Login</h1>
			<hr />
			{/* 声明式导航 */}
			声明式导航：
			<Link to="/article">文章页</Link>
			<hr />
			{/* 编程式导航 */}
			编程式导航：
			<button onClick={() => navigate('/article')}>文章页</button>
			&nbsp;
			<button onClick={() => navigate('/article?id=123&name=张三')}>文章页（SearchParams 传参）</button>
			&nbsp;
			<button onClick={() => navigate('/article/123/张三')}>文章页（Params 传参）</button>
		</>
	)
}

export default Login
